@charset "utf-8";
@import "common/reset";
@function r($px) {
    @return $px/100*1rem;
}


$color:#ff9344;
.web {
    header {
        .header_email {
            margin-top: r(32);
            margin-right: r(24);
            position: relative;
            button {
                background-color: transparent;
                position: absolute;
                right: r(10);
                .email_icon {
                    font-size: r(60);
                    color: $color;
                }
            }
            &:after {
                content: "2";
                position: absolute;
                right: r(-2);
                top: r(-2);
                width: r(28);
                height: r(28);
                border-radius: r(14);
                color: white;
                font-size: r(20);
                line-height: r(28);
                text-align: center;
                background-color: #fa5050;
            }
        }
    }
    section {
        .section_photo {
            .photo_img {
                width: r(170);
                height: r(170);
                overflow: hidden;
                margin-right: r(24);
                margin-left: r(20);
                img {
                    width: 100%;
                }
            }
            .photo_right {
                height: r(170);
                font-size: r(80);
                font-weight: bold;
                line-height: r(170);
                margin-right: r(20);
                a:visited {
                    color: black;
                }
            }
            .photo_login {
                font-size: r(26);
                color: #dddddd;
                padding-top: r(30);
                p:nth-of-type(1) {
                    margin-bottom: r(36);
                }
                a {
                    font-size: r(30);
                    color: black;
                }
            }
        }
        .func_button {
            text-align: center;
            margin-top: r(26);
            font-size: 0;
            button {
                width: r(195);
                height: r(151);
                font-size: r(26);
                .button_icon {
                    font-size: r(80);
                    color: white;
                }
            }
            .for_mine1 {
                background-color: #b2e0a0;
            }
            .for_mine2 {
                background-color: #a0dce0;
                margin-left: r(60);
                margin-right: r(60);
            }
            .for_mine3 {
                background-color: #e0b7a0;
            }
        }
        .banner {
            .personal_more {
                margin-left: r(12);
            }
            .connect {
                margin-left: r(20);
            }
        }
        .setting {
            margin-top: r(76);
        }
        .bottom_button{
            width: 100%;
          position: relative;
          margin-top: r(36);
            button{
                width: r(147);
                height: r(76);
                background-color: $color;
                color: white;
                text-align: center;
                line-height: r(76);
                border-radius: r(38);
                font-size: r(32);
            }
            .button_getout{
                position: absolute;
                left: 7.3%;
            }
            .button_loginout{
                position: absolute;
                right: 7.3%;
            }
        }
    }
}